﻿
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- saved from url=(0014)about:internet -->
<html>
    <head>
        <meta content="Innovasys Document! X (http://www.innovasys.com)" name=GENERATOR>
        <!--DXMETADATA start type="MetaCharset" --><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"><!--DXMETADATA end-->
        <!--DXMETADATA start type="PageItemTitle" format="<title>Overview</title>" --><title>MarkupGrid Object</title><!--DXMETADATA end-->
        <link href="stylesheets/axstylesheet.css" type=text/css rel=stylesheet>
        <script src="script/ax.js" type=text/javascript>
    </script>

    


<style>
html,div { margin: 0; padding: 0;}

body {
	padding: 0px;
	margin: 0px;
	overflow: auto;
	height: 100%;
}

#winchm_template_button{
	float: right;
	width: 93px;
	top: 7px;
	position: relative;
	text-align: right;
	right: 5px;
	height: auto;
}

#winchm_template_top{
	padding: 0px;
	margin: 0px;
	border-bottom: 1px solid #9B9B9B;
	background-color: #B1CEFE;
}

#winchm_template_navigation{
	margin: 0px;
	padding-top: 7px;
	padding-left: 7px;
	padding-bottom: 3px;
	padding-right: 0px;
	font-size: 8.5pt;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #585858;
}

#winchm_template_title{
	margin: 0px;
	padding-top: 4px;
	padding-left: 7px;
	padding-bottom: 7px;
	padding-right: 0px;
	font-size: 18px; 
	font-family: Verdana, Geneva, sans-serif;
	color: #363636;
}

#winchm_template_content{
	margin-top: 20px;
	margin-left: 15px;
	margin-bottom: 20px;
	margin-right: 15px;
	width: auto  !important;
	width: 100%;
}

#winchm_template_footer{
	border-width: 1px;
	border-color: #B1CEFE;
	border-top-style: solid;
	margin-top: 15px;
	margin-left: 15px;
	margin-bottom: 20px;
	margin-right: 15px;
	padding-top: 7px;
	padding-left: 0px;
	padding-bottom: 0px;
	padding-right: 0px;
	font-family: arial, helvetica, sans-serif;
	font-size: 8.5pt;
	color: #696969;
	width: auto;
	text-align: left;
}


#winchm_template_container{
	margin: 0px;
	padding: 0px;
	position: static;
	padding-bottom: 3px;
	overflow: auto;
	background-color: #FFFFFF;
}


@media print
{
#winchm_template_container{
	position: static;	
	margin: 0px;
	padding: 5px;
	
	width: auto;
	height: auto;
	overflow: auto;
}
#winchm_template_button{
visibility:hidden;
}
}

#winchm_template_navigation A:link	{text-decoration: none; color:#004080}
#winchm_template_navigation A:visited  {text-decoration: none; color: #004080}
#winchm_template_navigation A:active {text-decoration: none; color: #004080 }
#winchm_template_navigation A:hover {text-decoration: none;color: #0080FF}

A:link	{text-decoration: underline; color:#0033CC}
A:visited  {text-decoration: underline; color: #0033CC}
A:active {text-decoration: underline; color: #0033CC }
A:hover {text-decoration: underline;color: #FF0000;}
</style>
<script type="text/javascript">
function isMobile(){
Agent = window.navigator.userAgent;
if (Agent.indexOf("iPhone")>=1 || Agent.indexOf("iPad")>=1 || Agent.indexOf("iPod")>=1 || Agent.indexOf("Android")>=1){
return true;
}else{
return false;	
}

}
function d_onresize(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
document.getElementById('winchm_template_container').style.pixelWidth = document.body.offsetWidth - 3;
document.getElementById('winchm_template_container').style.pixelHeight = document.body.offsetHeight - document.getElementById('winchm_template_top').offsetHeight - 4;
}
document.getElementById('winchm_template_container').style.top = document.getElementById('winchm_template_top').offsetHeight + 'px';
}

function d_onbeforeprint(){
document.getElementById('winchm_template_container').style.width = 'auto';
document.getElementById('winchm_template_container').style.height = 'auto';
}

function d_onafterprint(){
d_onresize();
}

if(!isMobile()){

window.onload = d_onresize;
window.onresize = d_onresize;
window.onbeforeprint = d_onbeforeprint;
window.onafterprint = d_onafterprint;

document.write("<style>\n");
document.write("body {overflow: hidden;}\n");
document.write("#winchm_template_container {position: absolute;overflow: auto;top : 0px;right: 0px;bottom: 0px;left: 0px;}\n");
document.write("</style>\n");
}

</script>
</head>
    <body><script language="JavaScript" type="text/JavaScript">
function syn(){
if(parent.nav.tree){
 if(parent.nav.tree.loaded){
  parent.nav.tree.selectNode(9425);
 }else{
  setTimeout("syn()",500);
}
  }else{
  setTimeout("syn()",500);
  }}
if(parent!=self){
  setTimeout("syn()",100);
}else{
  parent.location.href = "../index.htm?page=XtremeMarkup~MarkupGrid.html";
}
originalOnload = window.onload;
if(originalOnload==null){
window.onload = function(){parent.contentLoaded = true;};
}else{
window.onload = function(){originalOnload();parent.contentLoaded = true;};
}
</script> 


<div id="winchm_template_top">
	<div id="winchm_template_button"><A href="XtremeMarkup~MarkupGrid.html" title="Previous topic"><img id="winchm_template_prev" alt="Previous topic" src="template2/btn_prev_n.gif" border="0"></a><A href="XtremeMarkup~MarkupGrid_members.html" title="Next topic"><img id="winchm_template_next" alt="Next topic" src="template2/btn_next_n.gif" border="0"></a></div>
	<div id="winchm_template_navigation">Help &gt; 
<A href="welcome_screen.htm">Codejock ActiveX Controls v15.3</A> &gt; <A href="XtremeMarkup_P.html">Xtreme Markup</A> &gt; Objects &gt; <A href="XtremeMarkup~MarkupGrid.html">MarkupGrid Object</A> &gt; </div>
	<div id="winchm_template_title">Overview</div>
</div>
<div id="winchm_template_container">
	<div id="winchm_template_content"><div class=popupbubble id=dxseealsomenu><p id=dxseealsocontent><a href="#Bookmark9426">MarkupGrid Members</a>
</p><!--DXMETADATA end --> 
        </div>
        <div id=pagetop>
            <div id=projectnamebanner>
                <table class=projectnametable cellspacing=0>
                    <tbody>
                        <tr>
                            <!--DXMETADATA start type="Literal" condition="childitems:itemtype=seealso" value="<td class='button'><a href='' id='seealsobutton' onclick='showSeeAlsoBox()'><img alt='See Also' border='0' src='axImages/seealso.gif' width=14 height=14></a></td>" --><td class='button'><a href='' id='seealsobutton' onclick='showSeeAlsoBox()'><img alt='See Also' border='0' src='axImages/seealso.gif' width=14 height=14></a></td><!--DXMETADATA end -->
                            <td>
                                <!--DXMETADATA start type="Phrase" Name="Product_Header" -->Xtreme Markup ActiveX Control v15.3<!--DXMETADATA end --> 
                            </td>
                            <td align=right>
                                <!--DXMETADATA start type="Variable" name="FeedbackLink" format="" --><!--DXMETADATA end -->
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div id=pagetitlebanner>
                <h1 class=dxh1>
                <!--DXMETADATA start type="PageItemTitle" -->MarkupGrid Object<!--DXMETADATA end --></h1>
            </div>
        </div>
        <div id=pagebody valign="bottom">
            <!--DXMETADATA start type="IsNew" format="<script>document.all.pagebody.className = 'newTopic'</script>" --><!--DXMETADATA end --> 
            <!--DXMETADATA start type="Description" source="Item" format="<h4 class=dxh4>$$Description$$</h4><p>%%description%%</p>" --><h4 class=dxh4>Description</h4><p>Grid Control</p><!--DXMETADATA end --> 
            <!--DXMETADATA start type="Scrap" name="_MEMBERS_LINK" format="<p>%%scrap%%</p>" --><p>For a list of all members defined in this module, see <a href="#Bookmark9426">MarkupGrid members</a>.</p><!--DXMETADATA end --> 
            <!--DXMETADATA start type="Diagram" source="item" format="<h4 class=dxh4>$$OBJECT_MODEL$$</h4><p>%%Diagram%%</p>" --><h4 class=dxh4>Object Model</h4><p><TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0><TR><TD NOWRAP>
<a href="#Bookmark9424"><img src="cDiagramImages/XtremeMarkup~MarkupGrid~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10334"><img src="cDiagramImages/XtremeMarkup~Margin_(MarkupThickness)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark8989"><img src="cDiagramImages/XtremeMarkup~Background_(MarkupBrush)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseLeaveEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseEnterEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseLeftButtonUpEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseLeftButtonDownEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseRightButtonUpEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseRightButtonDownEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~MouseMoveEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10040"><img src="cDiagramImages/XtremeMarkup~LostMouseCaptureEvent_(MarkupRoutedEvent)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark9734"><img src="cDiagramImages/XtremeMarkup~FindName_(MarkupObject)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10495"><img src="cDiagramImages/XtremeMarkup~VisualParent_(MarkupVisual)~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark10411"><img src="cDiagramImages/XtremeMarkup~Children_(MarkupUIElementCollection)~305.gif" border=0></a><img src="cDiagramImages/paracros.gif" border=0><a href="#Bookmark10390"><img src="cDiagramImages/XtremeMarkup~MarkupUIElement~305.gif" border=0></a><br><img src="cDiagramImages/parmult.gif" border=0><a href="#Bookmark9280"><img src="cDiagramImages/XtremeMarkup~ColumnDefinitions_(MarkupDefinitionCollection)~305.gif" border=0></a><img src="cDiagramImages/paracros.gif" border=0><a href="#Bookmark9277"><img src="cDiagramImages/XtremeMarkup~MarkupDefinitionBase~305.gif" border=0></a><br><img src="cDiagramImages/parchild.gif" border=0><a href="#Bookmark9280"><img src="cDiagramImages/XtremeMarkup~RowDefinitions_(MarkupDefinitionCollection)~305.gif" border=0></a><img src="cDiagramImages/paracros.gif" border=0><a href="#Bookmark9277"><img src="cDiagramImages/XtremeMarkup~MarkupDefinitionBase~305.gif" border=0></a>
</TD></TABLE>
</p><!--DXMETADATA end --> 
            <!--DXMETADATA start type="TaggedComment" source="Item" id="##MODULE_REMARKS" format="<h4 class=dxh4>$$Remarks$$</h4><p>%%comment%%</p>" --><h4 class=dxh4>Remarks</h4><p><P>Displaying elements in a table format using columns and rows is done with the Grid Control. <BR><BR>Unlike a Table, the Grid is used strictly for layout purposes. The Grid is useful in that you can arrange controls in columns and rows and have them lined up vertically and horizontally. This is nice if items are not all the same size, the columns and rows will still remain uniform. <BR><BR>The Grid is probably one of the more complex controls you will use. To use a Grid you must specify how many row and columns are needed, and how each row and column should be sized. Optionally, you can set the width and height of the grid.</P>
<P>&nbsp;</P>
<P><IMG src="Pictures/grid1.png" border=0></P></p><!--DXMETADATA end --> 
            <!--DXMETADATA start type="FilteredItemList" scrap="ITEM_LIST_WITH_HEADER" namespace="implemented interface" source="Item" filter="" format="<h4 class=dxh4>$$Interfaces$$</h4>%%filtereditemlist%%" --><!--DXMETADATA end --> 
            <!--DXMETADATA start type="TaggedComment" source="Item" id="##MODULE_EXAMPLEINTRO" format="<h4 class=dxh4>$$Example$$</h4><p>%%comment%%</p>" --><!--DXMETADATA end --> 
            <!--DXMETADATA start type="FilteredItemList" scrap="INLINE_EXAMPLE" namespace="Example" source="Item" filter="type=inline" NoHeader="True" NoFooter="True" format="<h4 class=dxh4>$$Example$$</h4>,format= %%%%filtereditemlist%%" --><h4 class=dxh4>Example</h4><DIV Class=LanguageSpecific Name=Example_><p><SPAN class="lang">[Grid Sample ()]</SPAN>&nbsp;Below is a very simple sample of how to use a Grid panel to create a 3x3 cube.</p><DIV Class=LanguageSpecific Name=Code_><TABLE Class="CodeContainerTable" CellPadding="0" CellSpacing="0" Border="0"><TR><TD NOWRAP><CODE Class="">&lt;Page&nbsp;xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'&nbsp;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'&nbsp;&gt;&nbsp;<BR/>&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&lt;Grid&nbsp;VerticalAlignment=&quot;Stretch&quot;&nbsp;HorizontalAlignment=&quot;Stretch&quot;&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Grid.ColumnDefinitions&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ColumnDefinition&nbsp;Width=&quot;33*&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ColumnDefinition&nbsp;Width=&quot;33*&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ColumnDefinition&nbsp;Width=&quot;33*&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/Grid.ColumnDefinitions&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Grid.RowDefinitions&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;RowDefinition&nbsp;MinHeight=&quot;50&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;RowDefinition&nbsp;MinHeight=&quot;50&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;RowDefinition&nbsp;MinHeight=&quot;50&quot;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/Grid.RowDefinitions&gt;&nbsp;<BR/>&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Red&quot;&nbsp;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;0&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Blue&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;1&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Green&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;0&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;2&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Yellow&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;1&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;0&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;White&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;1&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;1&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Orange&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;1&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;2&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Cyan&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;2&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;0&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;Gray&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;2&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;1&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;Border&nbsp;Background=&quot;LightGreen&quot;&nbsp;Grid.Row&nbsp;=&nbsp;&quot;2&quot;&nbsp;Grid.Column&nbsp;=&nbsp;&quot;2&quot;&nbsp;/&gt;&nbsp;<BR/>&nbsp;&nbsp;&nbsp;&nbsp;&lt;/Grid&gt;&nbsp;<BR/>&lt;/Page&gt;&nbsp;<BR/></CODE></TD></TR></TABLE></DIV></DIV>
<!--DXMETADATA end --> 
            <!--DXMETADATA start type="FilteredItemList" scrap="MENU_LINK" namespace="seealso" source="Item" filter="" NoHeader="True" NoFooter="True" format="<h4 class=dxh4>$$See_Also$$</h4><p id=dxseealsocontent>%%filtereditemlist%%</p>" --><h4 class=dxh4>See Also</h4><p id=dxseealsocontent><a href="#Bookmark9426">MarkupGrid Members</a>
</p><!--DXMETADATA end --><!--DXMETADATA start type="FilteredItemList" scrap="MENU_LINK" namespace="example" source="Item" filter="type=linked" NoHeader="True" NoFooter="True" format="><!--DXMETADATA end --><!--DXMETADATA start type="Variable" name="CopyrightNotice" format="><!--DXMETADATA end --></div></div>	
	<div id="winchm_template_footer">Copyright &copy; 2018. All rights 
reserved. (To change the copyright info, just edit it in template.)</div>
</div>

</body>
</html>

